import {
  PluginEntry,
  CardEntry,
  PluginOptions,
  EngineInterface,
} from "@aomao/engine";
//引入插件 begin
import Redo from "@aomao/plugin-redo";
import Undo from "@aomao/plugin-undo";
import Bold from "@aomao/plugin-bold";
import Backcolor from "@aomao/plugin-backcolor";
import Fontcolor from "@aomao/plugin-fontcolor";
import Fontsize from "@aomao/plugin-fontsize";
import Italic from "@aomao/plugin-italic";
import Underline from "@aomao/plugin-underline";
import Indent from "@aomao/plugin-indent";
import Strikethrough from "@aomao/plugin-strikethrough";
import Sub from "@aomao/plugin-sub";
import Sup from "@aomao/plugin-sup";
import Alignment from "@aomao/plugin-alignment";
import Quote from "@aomao/plugin-quote";
import PaintFormat from "@aomao/plugin-paintformat";
import RemoveFormat from "@aomao/plugin-removeformat";
import SelectAll from "@aomao/plugin-selectall";
import Link from "@aomao/plugin-link-vue";
import Image, { ImageComponent, ImageUploader } from "@aomao/plugin-image";
import Table, { TableComponent } from "@aomao/plugin-table";
import MarkRange from "@aomao/plugin-mark-range";
import LineHeight from "@aomao/plugin-line-height";
import { ToolbarPlugin, ToolbarComponent } from "@aomao/toolbar-vue";
import useUserInfoStore from "@/store/userInfo";
let engine: EngineInterface | null = null;
let userStore = {};
export const plugins: Array<PluginEntry> = [
  Redo,
  Undo,
  Bold,
  Backcolor,
  Fontcolor,
  Fontsize,
  Italic,
  Underline,
  Indent,
  Strikethrough,
  Sub,
  Sup,
  Alignment,
  Quote,
  PaintFormat,
  RemoveFormat,
  SelectAll,
  Link,
  Image,
  ImageUploader,
  Table,
  ToolbarPlugin,
  LineHeight,
  MarkRange,
];

export const cards: Array<CardEntry> = [
  ImageComponent,
  TableComponent,
  ToolbarComponent,
];
export const pluginConfig: { [key: string]: PluginOptions } = {
  [MarkRange.pluginName]: {
    //标记类型集合
    keys: ["mark"],
    //标记数据更新后触发
    onChange: (
      addIds: { [key: string]: Array<string> },
      removeIds: { [key: string]: Array<string> }
    ) => {
      // 新增的标记
      const commentAddIds = addIds["comment"] || [];
      // 删除的标记
      const commentRemoveIds = removeIds["comment"] || [];
    },
    //光标改变时触发
    onSelect: (
      range: RangeInterface,
      selectInfo?: { key: string; id: string }
    ) => {
      const { key, id } = selectInfo || {};
      // 移除预览标记
      engine?.command.executeMethod(
        "mark-range",
        "action",
        "comment",
        "revoke"
      );
      if (key === "mark" && id) {
        engine?.command.executeMethod(
          "mark-range",
          "action",
          key,
          "preview",
          id
        );
      }
    },
  },
  [ToolbarPlugin.pluginName]: {
    // config: true,
    config: [
      {
        title: "常用", // 可选
        items: ["image-uploader", "table"],
      },
    ],
  },
};

export const onLoad = (e: EngineInterface) => {
  userStore = useUserInfoStore();
  engine = e;
};
